<template>
  <div>
    <div @click="inted">
      <button>Aboutooooo</button>
    </div>
    <button @click="onclick">冒泡排序</button>
    <div>vue3.0:{{ state.count }},doelus is:{{ state.doule }}</div>
    <div>name is {{state.name}}</div>

     <button @click="invtme">+++++</button>
  </div>
</template>


<script>
import { ref,reactive,computed,onMounted} from "@vue/composition-api";
export default {
  setup() {
    const state = reactive({
      // count:ref(0),
      count :ref(0),
      name:ref('compenmt'),
      doule: computed(() => state.count * 2),
    });

    function invtme() {
      state.count++;
      state.name = 'boby'
    }
     onMounted(()=>{ console.log("Counter ===> 相当于 vue2.x 中 mounted")})
 
      return {
        // ...toRefs(state),
        state,
        invtme,
      };
  },
  
   
  
  
  data() {
    return {};
  },  
  mounted() {
    console.log("2.0挂载阶段");
  },

  methods: {
    inted() {
      console.log("222222222222");
      this.ajax({
        url: "v1/prod/main?line=line2&recipe=VR2-1-24",
        method: "GET",
      }).then((res) => {
        console.log(res.data);
      });
    },

    onclick() {
      var array = [3, 5, 2, 54, 16, 6, 28, 32, 44, 39, 42, 59, 86, 67];
      console.log("原始数组", array);
      var len = array.length;
      console.log("原始数组长度----", len);
      for (let i = 0; i < len; i++) {
        console.log("外部循环", len);
        for (let j = 0; j < len - i; j++) {
          if (array[j] > array[j + 1]) {
            var temp = array[j + 1];
            array[j + 1] = array[j];
            array[j] = temp;
          }
        }
      }
      console.log("排序后的数组", array);
      //  return array
    },
  },
};
</script>

<style  scoped>
</style>